<!--
  Generated template for the ComplainPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>充电申述</ion-title>
    <ion-buttons end>
      <button ion-button icon-only (click)="getComplain()">
          保存
      </button>
    </ion-buttons>
  </ion-navbar>

</ion-header>


<ion-content>
  <ion-list>
    <ion-list-header>
      充电信息
    </ion-list-header>
    <ion-item>

      <!--<div class="C-list-item-start" item-start text-center>
        <img src="assets/imgs/icon-account-circle.png" alt="" />
        <p class="icon-note">
          账户余额
        </p>
      </div>-->


      <div class="C-list-item-start" item-start text-center>

        <img src="assets/imgs/icon-account-circle.png" alt="" *ngIf="charging.payment_id === '4'" />
        <p class="icon-note" *ngIf="charging.payment_id === '4'">
          账户余额
        </p>

        <img src="assets/imgs/icon-weixin-circle.png" alt="" *ngIf="charging.payment_id === '1'" />
        <p class="icon-note" *ngIf="charging.payment_id === '1'">
          微信
        </p>

        <img src="assets/imgs/icon-zhifubao-circle.png" alt="" *ngIf="charging.payment_id === '2'" />
        <p class="icon-note" *ngIf="charging.payment_id === '2'">
          支付宝
        </p>
        
        <img src="assets/imgs/icon-bendi-circle.png" alt="" *ngIf="charging.payment_id === '3'" />
        <p class="icon-note" *ngIf="charging.payment_id === '3'">
          本地余额
        </p>

      </div>


      <!--<div class="C-list-item-content">
        <p class="node-address">
          南宁广告产业园负一楼
        </p>
        <p class="charging-date">
          <span class="ymd">2018-03-16</span>15:02:00
        </p>
      </div>-->

      <div class="C-list-item-content">
        <p class="node-address">
          {{cell_name}}
        </p>
        <p class="charging-date">
          <span class="ymd">{{(charging.charge_time_start * 1000) | date : 'yyyy-MM-dd HH:mm:ss'}}</span>
        </p>
      </div>

      <!--<div class="C-list-item-end" item-end text-center>
        <p>
          <span class="charging-cost">5.00</span>
        </p>
        <p>
          <span class="charging-time">4.5小时</span>
        </p>
      </div>-->

      <div class="C-list-item-end" item-end text-center>
        <p>
          <span class="charging-cost">￥{{charging.payment_money | number : '1.2-2'}}</span>
        </p>
        <p>
          <span class="charging-time">{{charging.charge_time}}小时</span>
        </p>
      </div>

    </ion-item>
  </ion-list>
  <ion-list>
    <ion-list-header>
      申述内容
    </ion-list-header>
    <ion-item>
      <ion-label>问题类型：</ion-label>
      <ion-select placeholder="请选择" interface="popover" [(ngModel)]="problem_type">
        <!--<ion-option value="nes">充电异常</ion-option>
        <ion-option value="n64">收费异常</ion-option>
        <ion-option value="ps"> 网络异常</ion-option>-->
        <ion-option *ngFor="let m of group; let i = index" value="{{m.D_VALUE}}" (ionSelect)="chooseValue(i)"> {{m.D_NAME_CN}}</ion-option>

      </ion-select>
    </ion-item>
    <ion-item>
      <ion-label>问题描述：</ion-label>
      <ion-textarea  rows="8" placeholder="如：充电桩插口松动" [(ngModel)]="remarks"></ion-textarea>
    </ion-item>
    <ion-item>
      <ion-label>照片上传：
      	
        <!--<i class="iconfont icon-gengduo"></i>-->
        <!-- <a href="#">
        <img src="./assets/imgs/add.png" alt="照片上传" style="vertical-align: top;" width="50"/>
        </a> -->
        <!--<a href="javascript:;" class="file">
          <input type="file" class="filePrew" name="getFile" accept="image/*" (change)="upLoadImg($event)">
        </a>-->
        <img src="./assets/imgs/add2.png" style="vertical-align: top;" (click)="presentActionSheet()"/>
        <div>
        	<ion-thumbnail item-start *ngFor="let img of selectedImgUrl; let i = index" class="deletImg">
	        	<img [src]="img">
	        	<span (click)= 'deleteimg(i)' class="deletImg2">x</span>
	        </ion-thumbnail>
        </div>
      </ion-label>

    </ion-item>
  </ion-list>


</ion-content>